<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=9,chrome=1"/>
    <title>付款方式</title>
    <link rel="stylesheet" href="css/payment.css">
    <script src="js/jquery.min.js"></script>
    <script src="js/urlTools.js"></script>

</head>
<body>
<div class="payWrap">
    <div class="payHeader clearfix">
        <strong class="fl" id="orderNumber">订单编号：aaaaaaaaaa</strong>
        <span class="fr"><strong class="fontsize">60.000</strong>元</span>
    </div>
    <section class="payContent">
        <div class="unionpayList activeBtn ">
            <div class="img">
                <img src="img/WeChatPayment.png" alt="wechat">
            </div>
            <span class=" unionpay1">微信</span>
            <span class=" unionPrice">支付<strong class="fontsize">60.00</strong>元</span>
        </div>
        <div class="unionpayList  ">
            <div class="img">
                <img src="img/AlipayPayment.jpg" alt="alipay">
            </div>
            <span class="  unionpay2">支付宝</span>
            <span class="unionPrice ">支付<strong class="fontsize">60.00</strong>元</span>
        </div>
        <div class="payBorder clearfix">
            <a href="javascript: confirmPayment()" class="fl payBut">确认支付</a>
            <a href="my_order.html" class="fl wait">稍后支付...</a>
        </div>

    </section>
</div>
<script>
    $(".unionpayList").click(function () {
        $(".unionpayList").removeClass("activeBtn");
        $(this).addClass("activeBtn")
    });

    let orderNumber = getQueryVariable("orderNumber");
    document.getElementById("orderNumber").innerHTML = "订单编号：" + orderNumber;
    // 得到这个订单编号里面有几张电影票, 并在这里计算钱数将钱传给页面
    jQuery.ajax({
        type: 'post',
        url: "/order/getOrderCount",
        data: {
            "orderNumber": orderNumber
        },
        success: function (body) {
            if (body === 0 || body === -2) {
                alert("订单不存在!");
                location.href = "my_order.html";
            }
            if (body === -1) {
                alert("这个订单已经支付过了! 即将跳转到订单页面");
                location.href = "my_order.html";
            }
            alert("这个订单如果未在 15 分钟内付款, 则订单将失效!");
            for (let i = 0; i <= 2; i++) {
                document.getElementsByClassName("fontsize")[i].innerHTML = body * 30;
            }
        }
    });


    function confirmPayment() {
        jQuery.ajax({
            type: 'post',
            url: "/order/confirmPayment",
            data: {
                "orderNumber": orderNumber
            },
            success: function (body) {
                if (body !== 1) {
                    alert("订单已失效! 跳转到订单页面");
                    location.href = "my_order.html";
                }
                location.href = "my_order.html";
            }
        });
    }
</script>
</body>
</html>
